// 使用Ajax获取用户数据
function loadUserData() {
    // 创建XMLHttpRequest对象
    var xhttp = new XMLHttpRequest();

    // 监听状态改变事件
    xhttp.onreadystatechange = function() {
        // 当请求完成且响应状态为200时
        if (this.readyState == 4 && this.status == 200) {
            // 解析JSON响应
            var users = JSON.parse(this.responseText);
            // 调用displayUserData函数显示用户数据
            displayUserData(users);
        }
    };

    // 发送GET请求到指定URL
    xhttp.open("GET", "/users", true);
    xhttp.send();
}

// 在页面上显示用户数据
function displayUserData(users) {
    // 获取包含用户数据的容器元素
    var userDataDiv = document.getElementById("dataContainer");
    // 清空容器元素的内容
    userDataDiv.innerHTML = "";

    // 遍历每个用户对象
    users.forEach(function(user) {
        // 创建一个新的<div>元素来显示用户数据
        var userDiv = document.createElement("div");
        // 设置<div>元素的文本内容为用户数据
        userDiv.textContent = "ID: " + user.id + ", Username: " + user.username + ", Age: " + user.age;
        // 将<div>元素添加到容器元素中
        userDataDiv.appendChild(userDiv);
    });
}

// 页面加载完成后加载用户数据
document.addEventListener("DOMContentLoaded", function() {
    // 调用loadUserData函数以获取和显示用户数据
    loadUserData();
});
